<html>
<head>
<meta charset="utf-8" />
<title>JS生成二维码</title>
<script type="text/javascript" src="jquery-1.8.0.min.js"></script>
<script type="text/javascript" src="jquery.qrcode.min.js"></script>
<style>
 #output{
  margin-left:300px; 
  margin-top:100px; 
 }
</style>
</head>
<body>

time: <?php
echo (strtotime('20150403')-strtotime('20150330'))/(24*3600);
 ?>
<div id="output"></div>

<div>
请输入url:<input id="createMark" maxlength="200" style="height: 40px; width: 300px" />
</div>
请输入json
<textarea id="json" style="width: 300px;height: 200px;"></textarea>
<div>

</div>

<script>
console.dir(document);
        var url  = document.URL;
        var doamin  = document.domain;
        var http  = url.indexOf('https://') !== false ? 'https://' : 'http://';
        var url = url.substr( (http + doamin).length - 1);
        console.log(http);
        console.log(url);
(function($){
var json = function(){
    try{
        $(this).val(JSON.stringify(JSON.parse($(this).val()), null, "\t"));
    }catch(e){
        
    }
    
};
var qmark = function(){
    $('#output').html('');
    QuickMark.create($(this).val());
};
$('#json').on({
    'keyup' : json,
    'change': json
});

$('#createMark').on({
    'keyup' : qmark,
    'change': qmark
})   
var QuickMark = {
    create:function (text, width, height) {
        if(text===''){
            return;
        }
  var trs = $('#output').qrcode({
   width: width?width:200,
   height: height?height:200,
   render: "canvas", //设置渲染方式 table canvas
   text: this.utf16to8(text),
   background: "#ffffff", //背景颜色 
   foreground: "black" //前景颜色 
  }).find('tr'), trLen = Math.floor(trs.size() / 2), tdLen = Math.floor(trs.eq(0).find('td').size() / 2), tds, bgColor;
  var colors = [['#ff0000', '#0100e2'], ['#00ed01', '#9f4d95']];
  trs.each(function (j) {
   tds = $(this).find('td');
   tds.each(function (i) {
    bgColor = this.style.backgroundColor;
    if (bgColor == 'red') {
     this.style.backgroundColor = colors[j < trLen ? 0 : 1][i < tdLen ? 0 : 1];
    }
   });
  });
 },
 utf16to8:function (str) {
  var out, i, len, c;
  out = "";
  len = str.length;
  for (i = 0; i < len; i++) {
   c = str.charCodeAt(i);
   if ((c >= 0x0001) && (c <= 0x007F)) {
    out += str.charAt(i);
   } else if (c > 0x07FF) {
    out += String.fromCharCode(0xE0 | ((c >> 12) & 0x0F));
    out += String.fromCharCode(0x80 | ((c >> 6) & 0x3F));
    out += String.fromCharCode(0x80 | ((c >> 0) & 0x3F));
   } else {
    out += String.fromCharCode(0xC0 | ((c >> 6) & 0x1F));
    out += String.fromCharCode(0x80 | ((c >> 0) & 0x3F));
   }
  }
  return out;
 }
}

 
})(jQuery);
</script>
  
<?php echo getenv('REMOTE_ADDR');?>
</body>
</html>
